//@ts-nocheck
import { SwiperRef } from 'antd-mobile/es/components/swiper';
import videojs from 'video.js';
// 引入axios
import server from '@/utlis/server';
import 'video.js/dist/video-js.css';
import React, { Fragment, useEffect, useRef, useState } from 'react';
import { CapsuleTabs, Rate } from 'antd-mobile';
import { NavBar, Typography } from 'react-vant';
import { StarOutline } from 'antd-mobile-icons';
import './index.less';
import { history } from 'umi';
import { ShareSheet, Button } from 'react-vant';
import { Cell, Video, Audio } from '@nutui/nutui-react';
import '@nutui/nutui-react/dist/style.css';
import '@/pages/golobo.less';
import 'lib-flexible';
import wx from './img/微信.png';
import qqkj from './img/QQ空间.png';
import wb from './img/微博.png';
import qqhy from './img/QQ.png';
import xkpcom from './img/想看.png';
import { DemoBlock } from 'demos';
import nb from './img/nb.png';
import sb from './img/sb.png';
import nm from './img/nm.png';
import az from './img/蜡笔小新.jpg';
import nmb from './img/111.jpg';
import nsb from './img/444.jpg';
import n2b from './img/2.png';
import ncb from './img/3.png';
import maiyan from '../../static/猫眼.png';
import { FixedNav, Barrage } from '@nutui/nutui-react';

const barrageStyle = {
  padding: '20px 0',
  height: '150px',
  boxSizing: 'border-box',
};

//分享链接
// const options = [
//   {
//     name: '微信',
//     icon: 'https://img1.baidu.com/it/u=3582852405,4232068154&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
//     href: 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&desc=&summary=&site=content%20site&pics=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC',
//   },
//   {
//     name: 'QQ空间',
//     icon: 'https://inews.gtimg.com/newsapp_bt/0/10516809855/1000',
//     href: 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&desc=&summary=&site=content%20site&pics=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC',
//   },
//   {
//     name: '微博',
//     icon: 'weibo',
//     href: 'https://service.weibo.com/share/share.php?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&pic=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC&appkey=',
//   },
//   {
//     name: 'QQ',
//     icon: 'qq',
//     href: 'http://connect.qq.com/widget/shareqq/index.html?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&source=content%20site&desc=&pics=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC',
//   },
// ];

const navList = [
  {
    id: 1,
    text: '微信',
    icon: 'https://img1.baidu.com/it/u=1707714900,126763117&fm=253&fmt=auto&app=138&f=JPEG?w=494&h=500',
    href: 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&desc=&summary=&site=content%20site&pics=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC',
  },
  {
    id: 2,
    text: '微博',
    icon: 'https://img0.baidu.com/it/u=2561751225,536586882&fm=253&fmt=auto&app=138&f=JPEG?w=450&h=306',
    href: 'https://service.weibo.com/share/share.php?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&pic=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC&appkey=',
  },
  {
    id: 3,
    text: 'QQ好友',
    // num: 2,
    icon: 'https://img1.baidu.com/it/u=2972873526,1285892618&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
    href: 'http://connect.qq.com/widget/shareqq/index.html?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&source=content%20site&desc=&pics=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC',
  },
  {
    id: 4,
    text: 'QQ空间',
    icon: 'https://inews.gtimg.com/newsapp_bt/0/10516809855/1000',
    href: 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=file%3A%2F%2F%2FE%3A%2Fovertrue-share.js-71e3b0c%2Fdemo%2Ftest-jquery.html&title=content%20title&desc=&summary=&site=content%20site&pics=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAACj1JREFUeF7tnY2R5DQQhXURQAZABAcRAJEAEQARABEAEQCRABEAEXBEAEQA1Yw1%2B51OT3pte3fmKLnqqna9LVnudj%2B9%2FrHvWSnln3L%2B8WEp5afOtHHu%2FcnlOPbLUsoXE%2FmvSikhF4eSpwyn%2B6CU8uN24udSSvzuHhzrjpnKPVsGWQZZHjLwk9ZD4ve9B%2BFIQZaaW0GZghpCk5Jx7sOBLCXjjHXWEDLXbWMZZL6HLIPgsVoeAmU47IvQ5EBWlmXR5RVMZeHLYW4KasjEHM8ZQRa3BwuylkFeVecyCHSyPMSgCA5kKShT8KUYWhZqHPaVDe7%2BFx6yDNJ%2Fsm%2B2hyyDvIYGUdBnoGZxoEnBncpfOUHfa8uyHA9ZBtkevVGkfhbtXQY5CbKcVPSvpZS%2Ftuspxb9bSnlzk%2Fm4lPLW9vN7pZQ3tp%2FpIa38R537%2BaGU8v12%2FkUpJf7FEfNXeT5sAU21HEAZQlZc9%2Bttnj8w%2F9uY87dSymebjIKsuNeYa3awPGEFhrMJ278fidSzVNdJqXB9qmaSpbGOfFZvIb8MsmnNUbCzeWeLW63RpEF6Vb5ZPqZOpiDom1LK822SgJoKLzxPD%2BF5BTV84lsI6kHTY3tIwHbAdxx7in7X7WHPYMclz4rglSLPOn%2BWhzg6sWSWQR7q6FloyqZdbIM4bMqaDEJkX4plEb4UWwu28zvwvsIRmZVKOgY7in9xxD3W0vE7YHrKQ%2F4upfzSYVyEJpdNpXR3pGSbutAmfISJOczKkeG6lUGUzJ57To1ZBulD1k0NUvuSWkvGxjw7yIi4H%2FHnz8FA6CERZP25XUDJMAAk7PC8gibKENZ4XkEQg0TKMDBUuuHYtE5Hm7rjPdmSrFMDoYzDpnjTZxWx1IbtxBujzX6q02WQ%2FnN%2BU4OQZRG%2BlDUpQ6bEWyOUEZqcwJCsTLEpsi8FX85YBUHKIGRfHEuYatkXoZ%2BBN%2FV4lWmVzgyvMghlsj28TsCosDnbt6ugzNmwnRjDYWhxLUePV5llkH6D9V0ahO5FtyPEMaAjTDGvRQbF9Dvhi%2Be5ryk4Yv6K0ER5egKZWDb9znkITUc9hHq86nrkIVzIlB1s9YZeI7UDU0d6e7nObDnXyWVxfie90kKuo7vrmGWQeS7rpgbJMq7WnWtl0GFZqnpIiFPVwGxanjDo5LJUvEEG5ea1FLOi7iTLopDDuBQjygaA7eJ6dZls0Oc01mUha5a5mP1d9SlIlrUMctGAE5HPlN%2F7u2UQlcuKDbIe6j0%2Flb9SASCDRMXEyNzIiAg1TkpF5a8Uy%2BKGzQCQ96iCwVGOi%2FqlTmmwq37d1InTEqRgJ5vvcgK6rEGyJVz19O%2BBOAf6ZU1dUd1lkFehzOlujFGPYpD62nFcgPClclnRM8VeqVq5o8HJshirtOd7sU08qRUKYmyV2XO%2BMksVnbNHiwqOe4q1xhH3WvvElHzITdMoLmSpzT77cifncToa92ycmTFOtO3I8JotIXgUD1kGuWggm%2BPaBVmEo3ZD7bEsul0LTbVNVEGZ4yEBA73mhNFGm%2BknY%2BUx4OW7beJRiqM%2B5U4ahPA1Mgih34pDlFeoRTkNDI5BHJZFGSd%2F5cx55NWEEUwqyOqedyzuut0ySN8saYPQdVQwSMMpiCPUEMrU06PkybICXnp9Y8xlxYOQhazenIQadrxHQFo76pUXUb4lStTd1Dh7BmdYzB5ZJ5DMwlR2HdmautvYsAyStcQmf1ODEIJoQZ539ppR1Y9B4oyJ0UMITWRHDAAd9tWO7UFcCztq3qojBoCuh0x1fS8FKsW%2BnI%2BTKcU5%2BS6OdVIhZ1YMu%2BmoZZAHk9ylQVTOyoWsGtC1zQy1g%2F0TdJ6rtAvZFxkUGRchaARZNd%2FFsZyzfZew5qZI9RU0MagkExvlsshiu7p2otNYnGMQBTtKYUfyYE410NnPs8Hgk6ROZpvXMsi8Q546PJxcVNVAuhR%2FVlWvlmXVRapeLMKC06PVbsCzgFHBGpmbA01UMFPuZGUjgyg9coxVoFKek81lOWn2I19y4DodVkYZhzU5sDYyiAOdyyCdADBbns0GjyPDHDJIGzCq1HQ9T2YV0FQZF9kUzysPdII7Mihu%2FAqmFO0fne%2FdL%2BFr1LEyahb5z2CjiqHjapQ5C3acrzo4uSynj8vxCscTnBiG%2B1Wr25fqIdkGBofGOglCZx7KHPnYZbbrxCnbOsZs79Hqy1Lp9KyH8Amgy49YVo%2BJKQ9RwV3LvmrDA9egAsw25d5rWnA8hOyr9QQVDEqWtUfxvTFZNsU5ssUtteasFzn37hikfSicN9GWQRztd2Se3CDq4%2FiBkfWgDM9z%2FdHxXr8TFRVD5q9qjiu%2BNVU%2F0hKy9XtZwcSqDMeSdESOqKbxQ7am8Xk%2BIKfCTsxTe6WUvLJRdLnXD%2BZEnoo5rjom7qN%2BO4vy0SJbv7sVsgxgle5eemFnutGY3XdZCHIgjnNm0%2BlHCIHLmuo1nBxXyE5zgm6jnNPstQwyx8S0QehSqvmBLkjYoXEVBEWX%2BOyTgIQ%2BQk0Ej7WHKuavjQcqJuHYYG513YQypcK4r1hHHAGT7N2qD2d0yBN%2Bqzzhq52fBuluA0ebHLIv5jjvGyqoUcpzPjjjBJJq%2FqObOueddqAsg8xh5m4MwkYAwhRdjdDEWyNT%2BhaMJd4frN%2Bh4tgR%2B6rQpFgWoSzLuAg7hBqedwwyYlltjFJ%2F7%2FbAjTxEPTtHvuTAObNfgcim1tX626RjfdicVDzndNIrI%2F%2FrwtcyyPy1aMdDXNo73U9agzhBjPIQFehxEZQhfKkAU8UhDADJphzGRYbGp5zMikGfUnYwxk%2B3BXLsfFe6SFgeoizI88ogTj7qSBb4CJvKfoy%2FxX31Yqyr%2FJ7cMkhHK87rz3vgyDGUNIjqHO81EcSFKE92xIBOsSYyLgaJzg2o3JQT9J3lIWRfas2jwNDaQxxlHJFxgsfs%2FNk0%2B1kGOdOjpIdklZGVXwbpa0waZPZ%2F0864NIv%2B9WeVs%2BJ5BWsq5c51tF9pqLkmBoaUV6xMPfEq0KN8NpBs9cgt4RokntnkwAtmc1b38L0sh1k5dfQ9JOBRmhyWQS4aONUgqqLl7BsM%2Bo54CGFNpcqPBIZkZW7Vr97%2FnkDSqbxe4WtP6kQZx6kAOvmrbFe8w7gcGefJ3sOypin3lgtnq4HLIGO8aA17mkEc9pWtADIt74x1oNJhXI6HqHwU2RQhjujCn0dNDky5d0saboFKKebIXpEdq9bgfGDZMYia34Ey58EJGVVTl83Wyr2WQVyVj%2BWWQTb9LA8xPnfhsLLsc3mkqugUopz1jDZ1jpevRU8%2F9zBYxZF9YBmko9in3tS5hGWQOzCIYwQnMHRei3ZaT48wqOy7hy3LugvIWgZ58IplkE0X6i1cZ8OmzJN7SHaB2affkecaHAhygkenrTTbozXS1Wmpk2WQiwYepSFORe23zPYuDzFYVtYrzkqpKDrsBHpqDQ40cWyWcbl7yDRdQm%2B5lxLuMsimgWWQh0fhLjzkX%2FZvhYLmqyY%2BAAAAAElFTkSuQmCC',
  },
];

export default function Index(props) {
  console.log(props, 'props的数据');

  // 底部数据
  let [bottomdata, setbottomdata] = useState([]);
  let [activekey, setactivekey] = useState('fruits');
  // 数据对象
  let [oneplayer, setoneplayer] = useState({});
  const list = [
    '画美不看',
    '不明觉厉',
    '喜大普奔',
    '男默女泪',
    '累觉不爱',
    '爷青结-',
  ];
  const barrageRef = useRef(null);
  const addBarrage = () => {
    const n = Math.random();
    if (barrageRef.current) {
      barrageRef.current.add(`随机——${String(n).substr(2, 10)}`);
    }
  };

  const [visible, setVisible] = useState(false);
  const change = (value: boolean) => {
    setVisible(value);
  };
  const selected = (item: any, event: MouseEvent) => {
    // console.log(item.href);
    window.open(item.href);
  };

  // const [visisu, setvisici] = useState(false);

  //视频
  const {} = props;
  const videoRef = useRef(null);
  const playerRef = useRef(null);
  const [option, setOptopm] = useState({});

  const onReadyPlay = (palyer) => {
    videoRef.current = palyer;
    palyer.play();
  };

  const init = () => {
    let _option = {
      controls: true,
      loop: false, //视频播放结束后，是否循环播放
      notSupportedMessage: '此视频暂无法播放，请稍后再试',
      poster: 'https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF', //视频封面
      controlBar: {
        // timeDivider: true,//是否显示时间控制条，默认为true
        // remainingTimeDisplay: false,//是否显示剩余时间，默认为true
        // fullscreenToggle: true // 全屏按钮
        children: [
          //自定义
          { name: 'playToggle' }, // 播放按钮
          {
            name: 'volumePanel', // 音量控制
            inline: false, // 不使用水平方式
          },
          { name: 'currentTimeDisplay' }, // 当前已播放时间
          { name: 'durationDisplay' }, // 总时间
          { name: 'progressControl' }, // 播放进度条
          {
            name: 'pictureInPictureToggle', //支持画中画
          },
          {
            name: 'FullscreenToggle', //支持全屏
          },
        ],
      },
    };

    setOptopm(_option);

    if (!playerRef.current) {
      const videoElement = videoRef.current;
      if (!videoElement) return;

      const player = (playerRef.current = videojs(
        videoElement,
        _option,
        () => {},
      ));
      onReadyPlay(player);
    }
  };
  //视频播放链接
  const [source, setSource] = useState({});
  // 获取底部数据
  let getdatabottom = async (key) => {
    let { data } = await server.get('/videobottom');
    // console.log(data);
    if (key == 'fruits' || activekey == 'fruits') {
      setbottomdata(data.data1);
    } else if (key == 'vegetables') {
      setbottomdata(data.data2);
    } else {
      setbottomdata(data.data3);
    }
  };

  // 获取数据对象
  let getoneplayer = async () => {
    let id = props.location.state._id;

    let { data } = await server.get('/oneplay?id=' + id);
    // console.log(data.data, 'xxx');

    setoneplayer(data.data);
    setSource(data.data.pre_id);
    init();
  };
  useEffect(() => {
    getoneplayer();
    getdatabottom();
  }, []);

  //跳转电影详情页面
  let deta = () => {
    history.push({
      pathname: '/details',
      state: {
        _id: oneplayer._id,
      },
    });
  };

  //跳转电影预告页面
  let yugaoa = (item) => {
    // console.log(item);

    history.push({
      pathname: '/yugao',
      state: {
        _id: item.paly_id._id,
      },
    });
  };
  // 获取当前事件
  let getnewdata = () => {
    let data = new Date();
    let year = data.getFullYear();
    let month = data.getMonth() + 1;
    let strDate = data.getDate();
    if (month < 10) month = `0${month}`; // 如果月份是个位数，在前面补0
    if (strDate < 10) strDate = `0${strDate}`; // 如果日是个位数，在前面补0

    return `${year}-${month}-${strDate}`;
  };
  let nummap = (mm) => {
    let num = Number(mm);
    return num.toFixed(1);
  };
  return (
    <div
      className="quanbu"
      style={{ width: '100%', height: '100%', backgroundColor: 'white' }}
    >
      <div className="cvba">
        <NavBar title="电影预告" leftText="返回" onClickLeft={deta} />
      </div>
      <hr />
      <div className="sp" style={{ width: '100%', height: '5rem' }}>
        {/* <Barrage className="barrage-demo" ref={barrageRef} barrageList={list} style={barrageStyle} /> */}
        <Cell className="cell">
          {/* <Barrage className="barrage-demo" ref={barrageRef} barrageList={list} style={barrageStyle} /> */}

          <video
            style={{
              width: '100%',
              height: '5',
            }}
            ref={videoRef}
            className="video-js vjs-big-play-centered"
          >
            {/* 视频链接地址 */}
            <source src={source.src} type="video/mp4" />
            <source src={source.src} type="video/mp4" />
          </video>
        </Cell>

        {/* <Cell className="barrage-demo-wrap" style={barrageStyle}>
        <Barrage className="barrage-demo" ref={barrageRef} barrageList={list} style={barrageStyle} />
      </Cell> */}
      </div>

      <hr />
      <div className="suduy">
        <h1 style={{ fontSize: '0.6rem' }}>简介</h1>
        {/* <Typography.Text
          ellipsis={{
            rows: 2,
            collapseText: '收起',
            expandText: '展开',
          }}
        >
          {oneplayer.self}
        </Typography.Text> */}

        <h2>{oneplayer.self}</h2>
        {/* <h2>
        <Typography.Text
          ellipsis={{
            rows: 2,
            collapseText: '收起',
            expandText: '展开',
          }}
        >
          {oneplayer.self}
        </Typography.Text>
          </h2> */}

        {/* <div
        className="detypographys"
        style={{ width: '10.1rem', marginTop: '0.2rem' }}
      >
        <Typography.Text
          ellipsis={{
            rows: 3,
            collapseText: '收起',
            expandText: '展开',
          }}
        >
          {oneplayer.self}
        </Typography.Text>
      </div> */}

        <p className="vbnc">{getnewdata()}</p>
      </div>

      <div className="xklanb">
        <img src={oneplayer.image} alt={oneplayer.name} />
        <div className="oneself">
          <h3>{oneplayer.name}</h3>
          <p>{oneplayer.type}</p>
        </div>
        <div className="onebtn">
          <Button round type="info">
            想看
          </Button>
        </div>
      </div>
      <div
        className="suduhj"
        style={{
          width: '100%',
          height: '17.3rem',
          backgroundColor: '',
          marginTop: '1rem',
        }}
      >
        <div className="fbvbvm">
          <CapsuleTabs
            activeKey={activekey}
            onChange={(key) => {
              setactivekey(key);
              getdatabottom(key);
            }}
          >
            <CapsuleTabs.Tab
              destroyOnClose={true}
              title="为你推荐"
              key="fruits"
            >
              {bottomdata.map((item) => {
                return (
                  <Fragment key={item._id}>
                    <div
                      className="vbnmxgf"
                      style={{ width: '100%', height: '3rem' }}
                      onClick={() => {
                        yugaoa(item);
                      }}
                    >
                      <span>
                        <img
                          src={item.paly_id.image}
                          alt=""
                          className="vbncfl"
                          style={{
                            width: '3.5rem',
                            height: '2rem',
                            padding: '0.5rem',
                          }}
                        />
                      </span>
                      <p
                        className="qbmdbswz"
                        style={{
                          marginLeft: '4.5rem',
                          marginTop: '-2.5rem',
                        }}
                      >
                        {item.paly_id.self}
                      </p>
                    </div>
                    <hr />
                  </Fragment>
                );
              })}
            </CapsuleTabs.Tab>
            <CapsuleTabs.Tab
              destroyOnClose={true}
              title="热门播放"
              key="vegetables"
            >
              {bottomdata.map((item) => {
                return (
                  <Fragment key={item._id}>
                    <div
                      className="vbnmxgf"
                      style={{ width: '100%', height: '3rem' }}
                      onClick={() => {
                        yugaoa(item);
                      }}
                    >
                      <span>
                        <img
                          src={item.paly_id.image}
                          alt=""
                          className="vbncfl"
                          style={{
                            width: '3.5rem',
                            height: '2rem',
                            padding: '0.5rem',
                          }}
                        />
                      </span>
                      <p
                        className="qbmdbswz"
                        style={{
                          marginLeft: '4.5rem',
                          marginTop: '-2.5rem',
                        }}
                      >
                        {item.paly_id.self}
                      </p>
                    </div>
                    <hr />
                  </Fragment>
                );
              })}
            </CapsuleTabs.Tab>
            <CapsuleTabs.Tab
              destroyOnClose={true}
              title="新片上映"
              key="animals"
            >
              {bottomdata.map((item) => {
                return (
                  <Fragment key={item._id}>
                    <div
                      className="vbnmxgf"
                      style={{ width: '100%', height: '3rem' }}
                      onClick={() => {
                        yugaoa(item);
                      }}
                    >
                      <span>
                        <img
                          src={item.paly_id.image}
                          alt=""
                          className="vbncfl"
                          style={{
                            width: '3.5rem',
                            height: '2rem',
                            padding: '0.5rem',
                          }}
                        />
                      </span>
                      <p
                        className="qbmdbswz"
                        style={{
                          marginLeft: '4.5rem',
                          marginTop: '-2.5rem',
                        }}
                      >
                        {item.paly_id.self}
                      </p>
                    </div>
                    <hr />
                  </Fragment>
                );
              })}
            </CapsuleTabs.Tab>
          </CapsuleTabs>
        </div>
      </div>
      <div
        className="fhgbcv"
        style={{
          width: '100%',
          height: '4rem',
          backgroundColor: '#f4f4f4',
          marginTop: '1.4rem',
        }}
      >
        <p
          className="gfsiem"
          style={{ textAlign: 'center', padding: '0.5rem' }}
        >
          麻豆电影 客服电话：
          <a href="###" style={{ color: 'red' }}>
            1010-1234-567
          </a>
        </p>
        <p
          className="mcbdkhf"
          style={{ textAlign: 'center', padding: '-0.5rem' }}
        >
          京ICP备16022489号-1 京公网安备11010102003232号
        </p>
        <p className="lvvdw" style={{ textAlign: 'center', padding: '0.5rem' }}>
          台湾麻豆文化传媒有限公司
        </p>
      </div>
      <FixedNav
        navList={navList}
        type="left"
        position={{ top: '500px' }}
        visible={visible}
        activeText="点击收起"
        unActiveText="点击分享"
        onChange={change}
        onSelected={selected}
        onCancel={() => setVisible(false)}
        onSelect={(option, index) => {
          setVisible();
        }}
      />
    </div>
  );
}
